<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org">
<head th:replace="_header_include::frag(~{::title},~{::style},~{})">
    <title>部门呼叫设置</title>
    <style>
        button a{color:#fff!important;}
        .formItem,.formItem .el-form-item__content{width:100%}
        .orgSelectOopover{width:100%;text-align: left;position: relative;border: 1px solid #dcdde2;background: #fff;}
        .orgSelectOopover:hover{background-color: #fff;border-color: #c0c4cc;}
        .orgSelectInput{position: absolute;left: 0;top: 0;width: 90%;}
        .orgSelectInput input{border: none;background: none;}
        .orgSelectInput input:hover{cursor: pointer;}
        .el-tree-node__expand-icon.is-leaf~.el-tree-node__label{color: #5c6be8;}
    </style>
</head>
<body>

<div id="mainDiv"  class="mainPadding" style="display: none;">
    <template>
        <el-breadcrumb separator="/" class="elBreadcrumb marginB20">
            <el-breadcrumb-item>Home</el-breadcrumb-item>
            <el-breadcrumb-item>业务设置</el-breadcrumb-item>
            <el-breadcrumb-item>部门呼叫设置</el-breadcrumb-item>
        </el-breadcrumb>

        <el-row>
            <el-col :span="12">
                <el-button type="primary" @click="openAddDialog()"><i class="el-icon-plus"></i>添加部门呼叫设置</el-button>
                <el-button type="warning" @click="openImportDataDialog()"><i class="el-icon-download"></i>导入呼叫信息</el-button>
                <el-button type="success" @click="openUpdateDialog"><i class="el-icon-edit"></i>修改</el-button>
            </el-col>
            <el-col :span="12" style="text-align: right;">
                <el-form :inline="true" :model="queryForm" class="demo-form-inline" ref="queryForm" >
                    <el-form-item label="部门编号:" prop="deptNo" style="margin-right: 10px;">
                        <el-input v-model="queryForm.deptNo" placeholder="部门编号"></el-input>
                    </el-form-item>
                    <el-form-item label="所在组织:" style="margin-right: 10px;">
                        <el-popover placement="bottom" trigger="click" v-model="isShow">
                            <div style="max-height: 300px;overflow-y: auto;">
                                <el-tree
                                    :data="dataTree"
                                    node-key="id"
                                    :default-expanded-keys="expandedKeys"
                                    ref="tree"
                                    highlight-current
                                    @node-click="treeNodeClick">
                                </el-tree>
                            </div>                                
                            <el-button slot="reference" class="orgSelectOopover" style="width: 160px;">
                                <el-input v-model="queryForm.orgName" placeholder="请选择所在组织" class="orgSelectInput" readonly></el-input>
                                <i class="el-icon-arrow-down" style="float: right;margin-right: -12px;color: #c0c4cc;"></i>
                            </el-button>
                        </el-popover>
                    </el-form-item>
                    <el-form-item label="">
                        <el-button icon="el-icon-search" type="primary" @click="initList">搜索</el-button>
                    </el-form-item>
                </el-form>
            </el-col>
        </el-row>
        <div class="mainSearchBg"> 
            <el-table :data="tableData"  style="width: 100%" tooltip-effect="light" border ref="multipleTable"
                      @selection-change="handleSelectionChange" >
                <el-table-column type="selection" width="55" prop="id" align="center"> </el-table-column>
                <el-table-column prop="xh" label="序号" width="55" align="center"></el-table-column>
                <el-table-column prop="deptNo" label="部门编号"  align="center" ></el-table-column>
                <el-table-column prop="callCenterNo" label="呼叫中心编号" align="center" ></el-table-column>
                <el-table-column prop="token" label="Token"  align="center"></el-table-column>
                <el-table-column prop="companyUser" label="企业用户名" align="center" ></el-table-column>
                <el-table-column prop="companyPass" label="企业用户名密码"  align="center" ></el-table-column>
                <el-table-column prop="deptUser" label="部门用户"  align="center" ></el-table-column>
                <el-table-column prop="deptPass" label="部门用户密码" align="center" ></el-table-column>
                <el-table-column prop="orgName" label="所属部门(组织)" align="center" width="200">
                    <template slot-scope="scope">
                        <p>{{ scope.row.orgName }}</p>
                        <el-button size="mini"  type="primary" @click="handleOrgSet(scope.$index, scope.row)">部门设置</el-button>   <!--handle(scope.$index, scope.row)  selectOrgs-->
                    </template>
                </el-table-column>
            </el-table>
            <table-pagination :pager="pager"  @change="initList"></table-pagination>
        </div>
    </template>


    

    <el-dialog title="添加部门呼叫设置" :visible.sync="addDialogVisible" @opened="addOpened" width="540px">
        <template>
            <el-form :model="add" ref="add" >

                <el-form-item label="部门编号："  :label-width="formLabelWidth">
                    <el-input v-model="add.deptNo" autocomplete="off"  maxlength="50"   style="width: 80%" ></el-input>
                </el-form-item>
                <el-form-item label="呼叫中心编号："  :label-width="formLabelWidth">
                    <el-input v-model="add.callCenterNo" autocomplete="off"  maxlength="50"   style="width: 80%" ></el-input>
                </el-form-item>
                <el-form-item label="Token："  :label-width="formLabelWidth">
                    <el-input v-model="add.token" autocomplete="off"  maxlength="50"   style="width: 80%" ></el-input>
                </el-form-item>
                <el-form-item label="企业用户名："  :label-width="formLabelWidth">
                    <el-input v-model="add.companyUser" autocomplete="off"  maxlength="50"   style="width: 80%" ></el-input>
                </el-form-item>
                <el-form-item label="企业用户名密码："  :label-width="formLabelWidth">
                    <el-input v-model="add.companyPass" autocomplete="off"  maxlength="50"   style="width: 80%" ></el-input>
                </el-form-item>
                <el-form-item label="部门用户："  :label-width="formLabelWidth">
                    <el-input v-model="add.deptUser" autocomplete="off"  maxlength="50"   style="width: 80%" ></el-input>
                </el-form-item>
                <el-form-item label="部门用户密码："  :label-width="formLabelWidth">
                    <el-input v-model="add.deptPass" autocomplete="off"  maxlength="50"   style="width: 80%" ></el-input>
                </el-form-item>
                <el-form-item label="所属部门(组织)："  :label-width="formLabelWidth">
                    <el-input v-model="add.orgName"   size="small" maxlength="50" style="width: 80%"  readonly >
                        <el-button slot="append" icon="el-icon-search" @click="selectOrgs">选择组织</el-button>
                    </el-input>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button  type="primary" ref="addbutton" @click="saveOne" :disabled="addButtonflag">提 交</el-button>
                <el-button @click="addDialogVisible = false">取 消</el-button>
            </div>
        </template>
    </el-dialog>

    <el-dialog title="修改部门呼叫设置" :visible.sync="updateDialogVisible" @opened="" width="540px">
        <template>
            <el-form :model="update" ref="update" >

                <el-form-item label="部门编号："  :label-width="formLabelWidth">
                    <el-input v-model="update.deptNo" autocomplete="off"  maxlength="50"   style="width: 80%" ></el-input>
                </el-form-item>
                <el-form-item label="呼叫中心编号："  :label-width="formLabelWidth">
                    <el-input v-model="update.callCenterNo" autocomplete="off"  maxlength="50"   style="width: 80%" ></el-input>
                </el-form-item>
                <el-form-item label="Token："  :label-width="formLabelWidth">
                    <el-input v-model="update.token" autocomplete="off"  maxlength="50"   style="width: 80%" ></el-input>
                </el-form-item>
                <el-form-item label="企业用户名："  :label-width="formLabelWidth">
                    <el-input v-model="update.companyUser" autocomplete="off"  maxlength="50"   style="width: 80%" ></el-input>
                </el-form-item>
                <el-form-item label="企业用户名密码："  :label-width="formLabelWidth">
                    <el-input v-model="update.companyPass" autocomplete="off"  maxlength="50"   style="width: 80%" ></el-input>
                </el-form-item>
                <el-form-item label="部门用户："  :label-width="formLabelWidth">
                    <el-input v-model="update.deptUser" autocomplete="off"  maxlength="50"   style="width: 80%" ></el-input>
                </el-form-item>
                <el-form-item label="部门用户密码："  :label-width="formLabelWidth">
                    <el-input v-model="update.deptPass" autocomplete="off"  maxlength="50"   style="width: 80%" ></el-input>
                </el-form-item>
                <el-form-item label="所属部门："  :label-width="formLabelWidth">
                    <el-input v-model="update.orgName"   size="small" maxlength="50" style="width: 80%"  readonly >
                        <el-button slot="append" icon="el-icon-search" @click="selectOrgs">选择组织</el-button>
                    </el-input>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button type="primary" ref="updateButton" :disabled="addButtonflag" @click="updateOne">提 交</el-button>
                <el-button @click="updateDialogVisible = false">取 消</el-button>
            </div>
        </template>
    </el-dialog>

    <el-dialog title="导入部门呼叫信息" :visible.sync="importDialogVisible" width="540px" @close="closedImportDiaog">
        <template>
            <el-row class="marginB20"><!--/deptcallset/download-->
                下载批量上传模版：<a href="/excel-templates/dept-call-setting.xlsx"  download="部门呼叫设置批量导入模板"><span style="color:#409EFF;text-decoration:underline;">部门呼叫设置模板</span></a>
            </el-row>
            <el-row>
                <el-upload
                        class="upload-demo"
                        ref="upload"
                        :multiple="false"
                        accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
                        action="/deptcallset/import"
                        :file-list="fileList"
                        :on-change="handleChange"
                        :before-upload="beforeUpload"
                        :on-remove="handleRemove"
                        :on-success="uploadSuccess"
                        :on-error="uploadError"
                        :data="paramData"
                        :auto-upload="false">
                    <el-button slot="trigger" size="small" type="success" style="margin-right: 10px;">上传文件</el-button>
                    <span slot="tip" class="el-upload__tip">只能上传xlsx文件</span>
                </el-upload>
            </el-row>
            <div slot="footer" class="dialog-footer">
                <el-button type="primary" @click="submitUpload('show')">确 定</el-button>  <!--submitUpload-->
                <el-button @click="importDialogVisible = false">取 消</el-button>
            </div>
        </template>
    </el-dialog>

    <el-dialog :visible.sync="OraTreeMuliCheckDialog" title="选择组织"  width="540px">
        <template>
            <div style="height: 300px;overflow-y:auto;overflow-x:auto;">
                <el-tree
                        :data="dataTree"
                        node-key="id"
                        :default-expanded-keys="expandedKeys"
                        :default-checked-keys="multipleTreeSelection"
                        ref="tree"
                        highlight-current
                        @node-click="clickOrgNode"
                        class="leftTree">
                </el-tree>
            </div>
            <!--
            <span slot="footer" class="dialog-footer">
                    <el-button @click="closeOraTreeMultiCheck">取 消</el-button>
                    <el-button type="primary" @click="returnCheckNodekeys">确 定</el-button>
            </span>
            -->
        </template>
    </el-dialog>

    <el-dialog :visible.sync="showTableDateDialog" title="预览数据"  @opened="showTableOpen" width="870px" :close-on-click-modal="false">
        <template>
            <el-row class="marginB20">
                预览数据共 <span id="importNum">0</span> 条资源
            </el-row>
            <el-row>
                <el-table :data="tableData1"  style="width: 100%" tooltip-effect="light"  ref="showTable">
                    <el-table-column prop="deptNo" label="部门编号"  align="center" ></el-table-column>
                    <el-table-column prop="callCenterNo" label="呼叫中心编号" align="center" ></el-table-column>
                    <el-table-column prop="token" label="Token"  align="center"></el-table-column>
                    <el-table-column prop="companyUser" label="企业用户名" align="center" ></el-table-column>
                    <el-table-column prop="companyPass" label="企业用户名密码"  align="center" ></el-table-column>
                    <el-table-column prop="deptUser" label="部门用户"  align="center" ></el-table-column>
                    <el-table-column prop="deptPass" label="部门用户密码" align="center" ></el-table-column>
                    <el-table-column prop="orgName" label="所属部门(组织)" align="center" ></el-table-column>
                </el-table>
            </el-row>
            <div slot="footer" >
                <el-button type="primary" ref="importButton" @click="submitUpload('import')" :disabled="flag">导 入</el-button>
            </div>
        </template>
    </el-dialog>

    <el-dialog :visible.sync="showErrTableDateDialog"   width="870px" :close-on-click-modal="false">
        <template>
            <div slot="title" style="text-align: center;font-weight: bold;font-size: 18px">
                部分导入失败
            </div>
            <el-row class="marginB20">
                <p style="font-size: 14px;text-indent: 4em">以下内容导入失败，请重新导入</p>
            </el-row>
            <el-row>
                <el-table :data="tableData2" style="width: 100%" tooltip-effect="light"  ref="showTable">
                    <el-table-column prop="deptNo" label="部门编号"  align="center" ></el-table-column>
                    <el-table-column prop="callCenterNo" label="呼叫中心编号" align="center" ></el-table-column>
                    <el-table-column prop="token" label="Token"  align="center"></el-table-column>
                    <el-table-column prop="companyUser" label="企业用户名" align="center" ></el-table-column>
                    <el-table-column prop="companyPass" label="企业用户名密码"  align="center" ></el-table-column>
                    <el-table-column prop="deptUser" label="部门用户"  align="center" ></el-table-column>
                    <el-table-column prop="deptPass" label="部门用户密码" align="center" ></el-table-column>
                    <el-table-column prop="orgName" label="所属部门(组织)" align="center" ></el-table-column>
                </el-table>
            </el-row>
            <div slot="footer" >
                <el-button type="primary" @click="showErrTableDateDialog=false">知道了</el-button>
            </div>
        </template>
    </el-dialog>
</div>

<!-- import common js-->
<div th:include="_footer_include :: #jsLib"></div>
<!--<script th:src="@{/js/excel/xlsx.min.js}" src="../static/js/excel/xlsx.min.js"></script>-->
<script>
    const validateAcquaintance= (rule, value, callback) => {
        if (!value) {
            callback(new Error('必须输入'))
        }
        value = Number(value)
        if (typeof value === 'number' && !isNaN(value)&&(value%1 === 0)) {
            if (value <=0) {
                callback(new Error('输入的值为正整数'))
            } else {
                callback()
            }
        } else {
            callback(new Error('输入的值为正整数'))
        }
    }
    // 查询 模块
    var mainDivVM = new Vue({
        el: '#mainDiv',
        data: {
            addButtonflag:false,
            isShow:false,
            flag:false,
            formLabelWidth:'150px',
            addDialogVisible:false,
            updateDialogVisible:false,
            OraTreeMuliCheckDialog:false,
            importDialogVisible:false,
            showTableDateDialog:false,
            showErrTableDateDialog:false,
            checkStrictly:true,
            expandedKeys:[],
            dataTree:[],
            multipleTreeSelection:[],
            multipleTreeSelectionName:[],
            orgFlag:"",
            fileList:[],
            add:{
                deptNo:"",
                callCenterNo:"",
                token:"",
                companyUser:"",
                companyPass:"",
                deptUser:"",
                deptPass:"",
                orgId:"",
                orgName:""
            },
            update:{
                id:"",
                deptNo:"",
                callCenterNo:"",
                token:"",
                companyUser:"",
                companyPass:"",
                deptUser:"",
                deptPass:"",
                orgId:"",
                orgName:""
            },
            orgSet:{
            },
            paramData:{
                importFlag:""
            },//上传文件携带的参数
            rules:{
            },
            queryForm:{
                deptNo:"",
                orgId:"",
                orgName:""
            },
            orgOptions: [],
            orgLeafOptions: [],
            tableData:[],
            tableData1:[],
            tableData2:[],
            multipleSelection:[],
            pager:{
                total: 0,
                currentPage: 1,
                pageSize: 20,
            },
        },
        methods: {

            initList() {
                var param = this.queryForm;
                param.pageSize = this.pager.pageSize;
                param.pageNum =  this.pager.currentPage;
                console.log(param)
                axios.post('/deptcallset/queryDeptcallset',param).then(function (response) {
                    if(null===response||response.data==null||response.data.code!='0'){
                        if(response.data.code!='0'){
                            mainDivVM.$message({message: response.data.msg, type: 'warning'});
                        }
                        return false;
                    }else{
                        mainDivVM.tableData =response.data.data.data;
                        mainDivVM.pager.currentPage= response.data.data.currentPage;
                        mainDivVM.pager.total= response.data.data.total;
                        mainDivVM.pager.pageSize =  response.data.data.pageSize;
                    }
                })
            },
            initOrgs(){
                var param = {}
                axios.post('/deptcallset/listLeafOrg',param).then(function (response) {
                    if(null===response||response.data==null||response.data.code!='0'){
                        return ;
                    }else{
                        mainDivVM.orgLeafOptions = response.data.data;
                    }
                })

                // axios.post('/deptcallset/allOrgs',param).then(function (response) {
                //     if(null===response||response.data==null||response.data.code!='0'){
                //         return ;
                //     }else{
                //         mainDivVM.orgOptions = response.data.data;
                //         mainDivVM.orgOptions.unshift({
                //             id:"",
                //             name:"请选择组织"
                //         })
                //     }
                // })
            },
            updateOne(){
                var param = mainDivVM.update;
                this.addButtonflag = true; 
                axios.post("/deptcallset/updateDeptcallset", param)
                    .then(function (response) {
                        // console.log(response.data);
                        if (response.data.code == 0) {
                            mainDivVM.$message({type: 'success', message: '更新成功!',duration:2000,onClose:function(){
                                    mainDivVM.pager.pageNum = 1;
                                    mainDivVM.initList();
                                    mainDivVM.updateDialogVisible = false;
                                    mainDivVM.addButtonflag = false; 
                                }});
                        } else {
                            mainDivVM.$message.error(response.data.msg);
                            mainDivVM.addButtonflag = false; 
                        }
                    }).catch(function (error) {mainDivVM.addButtonflag = false; console.log(error);});
            },
            openAddDialog(){
                mainDivVM.multipleTreeSelection = []
                mainDivVM.orgFlag="add"
                mainDivVM.addDialogVisible= true;
                mainDivVM.add = {};
            },
            openUpdateDialog(){
                var rows = this.multipleSelection;
                if(rows.length==0){
                    this.$message({message: '请选择一条数据进行修改', type: 'warning'});
                    return false;
                }if(rows.length>1){
                    this.$message({message: '请选择一条数据进行修改', type: 'warning'});
                    return false;
                }else{
                    var param = {};
                    param.id = rows[0].id;
                    axios.post("/deptcallset/queryOne", param)
                        .then(function (response) {
                            console.log(response.data)
                            if (response.data.code == 0) {
                                mainDivVM.update=response.data.data
                                mainDivVM.orgFlag="update"
                                mainDivVM.multipleTreeSelection=[]
                                mainDivVM.multipleTreeSelection.push(mainDivVM.update.orgId)
                                mainDivVM.updateDialogVisible = true;
                            } else {
                                mainDivVM.$message.error(response.data.msg);
                            }
                        }).catch(function (error) {console.log(error);});
                }
            },
            openImportDataDialog(){
                this.fileList = []
                // document.getElementById("importNum").innerText = 0;
                this.importDialogVisible = true;

            },
            closedImportDiaog(){
                this.$refs.upload.clearFiles();
            },
            saveOne(){
                var param = this.add;
                this.$refs['add'].validate((valid) => {
                    if (valid) {
                        mainDivVM.addButtonflag=true;
                        axios.post("/deptcallset/saveOne", param)
                            .then(function (response) {
                                if (response.data.code == 0) {
                                    mainDivVM.$message({type: 'success', message: '插入成功!',duration:2000,onClose:function(){
                                            mainDivVM.pager.pageNum = 1
                                            mainDivVM.initList();
                                            mainDivVM.addDialogVisible = false;
                                            mainDivVM.addButtonflag=false;
                                    }});
                                } else {
                                    mainDivVM.$message.error(response.data.msg);
                                    mainDivVM.addButtonflag=false;
                                }

                            }).catch(function (error) {
                                mainDivVM.addButtonflag=false;console.log(error);});
                    } else {return false;}
                });
            },
            selectOrgs:function(){
                //  打开 组织机构多选框
                mainDivVM.OraTreeMuliCheckDialog = true;
                var param = {};
                axios.post("/organization/organization/query", param).then(function (response) {
                    mainDivVM.expandedKeys = [];
                    mainDivVM.dataTree = response.data.data;
                    for(var i=0;i<mainDivVM.dataTree.length;i++){
                        var curNode = mainDivVM.dataTree[i];
                        mainDivVM.expandedKeys.push(curNode.id);
                        var childs = curNode.children;
                        if(childs){
                            for(var j=0;j<childs.length;j++){
                                var curChildNode = childs[j];
                                mainDivVM.expandedKeys.push(curChildNode.id);
                            }
                        }
                    }
                }).catch(function (error) { console.log(error);});
            },
            initTree:function(){
                //  打开 组织机构多选框
                var param = {};
                axios.post("/organization/organization/query", param).then(function (response) {
                    mainDivVM.dataTree = response.data.data;
                    mainDivVM.expandedKeys = [];
                    for(var i=0;i<mainDivVM.dataTree.length;i++){
                        var curNode = mainDivVM.dataTree[i];
                        mainDivVM.expandedKeys.push(curNode.id);
                        var childs = curNode.children;
                        if(childs){
                            for(var j=0;j<childs.length;j++){
                                var curChildNode = childs[j];
                                mainDivVM.expandedKeys.push(curChildNode.id);
                            }
                        }
                    }

                }).catch(function (error) { console.log(error);});
            },
            handleOrgSet(index , row){
                this.multipleTreeSelection=[];
                this.multipleTreeSelection.push(row.orgId);
                this.orgFlag = "orgset";
                this.orgSet.id = row.id;
                this.orgSet.orgId = row.orgId
                this.selectOrgs();
            },
            handleTreeSelectionChange(currentNode,allCheckNodes) {//选择节点的事件
                this.multipleTreeSelection = [];
                this.multipleTreeSelectionName = [];
                this.multipleTreeSelection.push(currentNode.id);
                this.multipleTreeSelectionName.push(currentNode.label)
                console.log(this.$refs.tree)
                console.log(this.multipleTreeSelection)
                this.$refs.tree.setCheckedNodes(this.multipleTreeSelection);
            },
            handleChange(file,fileList){//只允许选择一个文件
                if(this.paramData.importFlag=="show"){
                    file.status = "ready"
                }
                this.fileList = fileList.slice(-1);
            },
            beforeUpload(file){//上传之前 文件校验

                var isTextComputer = file.type === 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet';
                if(!isTextComputer){
                    this.$message.error('文件格式错误');
                    return false;
                }
            },
            handleRemove(file, fileList){
                this.fileList=[]
            },
            showTableOpen(){
                if(this.tableData1)
                    document.getElementById("importNum").innerText=this.tableData1.length
                else
                    document.getElementById("importNum").innerText = 0
            },
            uploadSuccess(response, file, fileList){//上传成功后
                console.log( response)
                console.log(mainDivVM.paramData.importFlag)
                if(mainDivVM.paramData.importFlag=="show"){
                    this.tableData1 = response.data
                    this.showTableDateDialog = true;
                }else{
                    if(response.code=='0'){
                        //清空文件里列表
                        this.$refs.upload.clearFiles();
                        this.importDialogVisible = false;
                        this.showTableDateDialog = false;
                        // showErrTableDateDialog:false,
                        if(response.data==true){
                            this.$message({message:'导入成功',type:'success',duration:2000,onClose:function(){
                                    mainDivVM.initList();
                                }});
                        }else{
                            this.$message({message:'部分导入失败',type:'warning',duration:2000,onClose:function(){
                                    mainDivVM.initList();
                                }});
                            mainDivVM.tableData2 = response.data
                            mainDivVM.showErrTableDateDialog = true;
                        }
                        mainDivVM.$refs.importButton.$el.innerText="导 入"
                        mainDivVM.flag=false
                    }else{
                        this.$refs.upload.clearFiles();
                        this.importDialogVisible = false;
                        this.showTableDateDialog = false;
                        this.$message('上传失败,'+response.msg);
                    }
                }
            },
            uploadError(){//上传失败
                this.$message({message:'上传失败',type:'error'});
            },
            submitUpload(flag) {//提交文件

                this.paramData.importFlag = flag;
                var fileList = this.fileList;
                console.log(fileList)
                console.log(fileList.length)
                if(!fileList || fileList.length!=1){
                    this.$message.error({message:'未选中文件',type:'error'});
                    return false;
                }
                if(flag=="import"){
                    this.$alert('<center><strong>确认导入数据</strong></center>', {
                        dangerouslyUseHTMLString: true,
                        center:true
                    }).then(() => {

                        mainDivVM.$refs.importButton.$el.innerText="导入中..."
                        mainDivVM.flag=true
                        mainDivVM.$refs.upload.submit();
                    });
                }else{
                    this.$refs.upload.submit();
                }
            },

            returnCheckNodekeys(){
                var id = this.multipleTreeSelection[0]
                var name = this.multipleTreeSelectionName[0]
                console.log(this.orgFlag)
                if(this.orgFlag=='add'){
                    this.add.orgId = id;
                    this.add.orgName = name;
                    this.OraTreeMuliCheckDialog = false
                }else  if(this.orgFlag=='update'){
                    this.update.orgId = id;
                    this.update.orgName = name;
                    this.OraTreeMuliCheckDialog = false
                }else{
                    mainDivVM.orgSet.orgId = id;
                    var param = mainDivVM.orgSet;
                    console.log(param)
                    axios.post("/deptcallset/updateDeptcallsetForNotNull", param)
                        .then(function (response) {
                            console.log(response.data)
                            if (response.data.code == 0) {
                                mainDivVM.$message({type: 'success', message: '更新成功!',duration:2000,onClose:function(){
                                        // mainDivVM.pager.pageNum = 1
                                        mainDivVM.initList();
                                        mainDivVM.OraTreeMuliCheckDialog = false
                                    }});
                            } else {
                                mainDivVM.$message.error(response.data.msg);
                            }
                        }).catch(function (error) {console.log(error);});
                }

            },
            handleSelectionChange(val) {
                this.multipleSelection = val;
            },
            closeOraTreeMultiCheck(){
                this.OraTreeMuliCheckDialog = false
            },
            treeNodeClick(data,node,obj){
                if(data.children==null){
                    this.queryForm.orgName=data.label;
                    this.queryForm.orgId=data.id;
                    this.isShow=false
                }
            },
            clickOrgNode(data,node,obj){//点击左侧节点
                console.log(data)
                if(data.children==null) {
                    if (this.orgFlag == 'add') {
                        this.add.orgId = data.id;
                        this.add.orgName = data.label;
                        this.OraTreeMuliCheckDialog = false
                    } else if (this.orgFlag == 'update') {
                        this.update.orgId = data.id;
                        this.update.orgName = data.label;
                        this.OraTreeMuliCheckDialog = false
                    } else {
                        mainDivVM.orgSet.orgId = data.id;
                        var param = mainDivVM.orgSet;
                        console.log(param)
                        axios.post("/deptcallset/updateDeptcallsetForNotNull", param)
                            .then(function (response) {
                                console.log(response.data)
                                if (response.data.code == 0) {
                                    mainDivVM.$message({
                                        type: 'success', message: '更新成功!', duration: 2000, onClose: function () {
                                            // mainDivVM.pager.pageNum = 1
                                            mainDivVM.initList();
                                            mainDivVM.OraTreeMuliCheckDialog = false
                                        }
                                    });
                                } else {
                                    mainDivVM.$message.error(response.data.msg);
                                }
                            }).catch(function (error) {
                            console.log(error);
                        });
                    }
                }
            },
            resetForm(formName) {
                console.log( mainDivVM.$refs[formName])
                if( mainDivVM.$refs[formName]){
                    mainDivVM.$refs[formName].resetFields();
                }
            },
            addOpened(){
                // mainDivVM.resetForm("add")
            }
        },
        created(){
            // 取页数存储
            var localVal=localStorage.getItem('allChangePageSize')?parseInt(localStorage.getItem('allChangePageSize')):'';
            if(localVal){this.pager.pageSize = localVal;}

            this.initOrgs();
            this.initList();
            this.initTree();
        },//created方法 结束
        mounted(){
            document.getElementById('mainDiv').style.display = 'block';
        }
    });

</script>
<style>

    .dialog-footer{
        text-align: center;
    }
    .el-input__inner{
    //   width: 200px;
    }
    .el-button--danger:focus, .el-button--danger:hover{
        background: #6f7180;
        border: #6f7180;
    }
    .el-button--danger{
        background: #6f7180;
        border: #6f7180;
    }
</style>
</body>
</html>